<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button class="btn1">存cookie</button>
		<button class="btn2">获取cookie</button>
		<button class="btn3">删除cookie</button>
		<script type="text/javascript">
				// 离线存储 ：通过浏览器功能来持久化保存数据
				// 1.cookie ： 小甜饼 ，就是浏览器用于存放数据的文件；
				// 如何使用？一、服务端操作cookie  二 通过客户端操作cookie；
				// 通过客户端操作cookie
			let btn1Ele = document.querySelector(".btn1");
			// 1.存cookie 2种过期时间的设置方法；
			btn1Ele.onclick = function(){
				// 设置过期时间  1.设置Max-Age= 过期时间（单位是秒）
				// document.cookie = "name=lisi111;Max-Age="+3600;
				// 2.设置  expires ：当前时间+过期时间  GTM 的字符串 ；
				let date = new Date();
				let nowTime = new Date().getTime();
				date.setTime(nowTime+3600*1000);
				document.cookie = "name=lisi222;expires="+date.toUTCString();
			}
			
			// 2.获取cookie 注意：1.cookie没有过期 2.cookie的作用域范围内 （域名、path：路径）
			let btn2Ele = document.querySelector(".btn2");
			btn2Ele.onclick = function(){
				console.log(document.cookie);
			}
			
			
		</script>
	</body>
</html>
